import React from "react";
import _ from "lodash";
import { Tag, Button } from "antd";

import styles from "./style.module.css";

export const columns = ({ handleCompleteOrCancel }) => {
    return [
        {
            title: "编号",
            dataIndex: "id",
            key: "id",
        },
        {
            title: "名称",
            dataIndex: "name",
            key: "name",
        },
        {
            title: "内容描述",
            dataIndex: "content",
            key: "content",
        },
        {
            title: "到期时间",
            dataIndex: "endDate",
            key: "endDate",
        },
        {
            title: "状态",
            key: "status",
            dataIndex: "status",
            render: (text) => {
                switch (text) {
                    case 1:
                        return <Tag color={"orange"}>待完成</Tag>;
                    case 2:
                        return <Tag color={"green"}>已完成</Tag>;
                    case 3:
                        return <Tag color={"red"}>已删除</Tag>;
                    default:
                        return "";
                }
            },
        },
        {
            title: "创建时间",
            dataIndex: "createTime",
            key: "createTime",
        },
        {
            title: "到期时间",
            dataIndex: "updateTime",
            key: "updateTime",
        },
        {
            title: "操作",
            key: "actions",
            render: (text, record) => {
                const id = _.get(record, "id");
                const status = _.get(record, "status");
                return status && status === 3 ? null : (
                    <span className={styles.actions}>
                        <Button onClick={() => {}}>修改</Button>
                        <Button
                            onClick={() =>
                                handleCompleteOrCancel(id, status === 1 ? 2 : 1)
                            }
                        >
                            {status === 1 ? "完成" : "取消完成"}
                        </Button>
                        <Button type={"danger"} onClick={() => {}}>
                            删除
                        </Button>
                    </span>
                );
            },
        },
    ];
};
